﻿<div class="form-group col-md-12" style="border:1px solid; height:80px">
<div class="row" style="height:30px"></div>
    <div class="row" >
        <label for="dealName" class="col-md-1 control-label-period" style="width:50px;">
            Deal:
        </label>
        <div class="col-md-1" style="width:50px;">
            <label class="control-label-period" id="dealName">{{dealName}}</label>
        </div>

        <label for="periodEndDate" class="col-md-2 control-label-period" style="width:120px;">
            Payment Date:
        </label>
        <div class="col-md-3" style="margin-left:-20px">
            <div datetimepicker value="paymentDate" readonly="true" />
        </div>

        <label for="periodEndDate" class="col-md-2 control-label-period" style="width:150px;">
            New Period End Date:</label>
       <div class="col-md-3" style="margin-left:-20px">
           <div datetimepicker value="periodEndDate" readonly="true" />
        </div>

        <div class="col-md-2">
            <button type="newPeriod" class="btn btn-primary form-control" ng-click="addPeriod()">New Period</button>
        </div>
    </div>
</div>    

<div class="form-group col-md-12" style="padding-left:0px; padding-right:0px;" >
    
        <div  class="grid-style" ui-grid="periodList"  ui-grid-resize-columns >
        </div>
  
</div>
<div class="form-group col-md-10">
    <div class="row" >
        <div class="col-md-2">
            <select id="pagesize" name="pagesize" ng-model="selectedLevel" ng-options="s.id as s.levelName for s in levelList"
                ng-change="pagesizechange(selectedLevel)" class="form-control input-sm" style="margin-top: 20px; margin-bottom: 20px;">
            </select>
        </div>
        <pagination max-size="maxSize" items_per_page="itemsperpage" total-items="totalItems"
            ng-model="currentPage" ng-change="pageChanged()"></pagination>
    </div>
</div>
